/**
 * 标签页会话管理器 - 弹出窗口脚本
 * 处理用户界面交互和与后台脚本的通信
 */

// DOM元素
const sessionNameInput = document.getElementById("session-name");
const saveSessionButton = document.getElementById("save-session");
const saveStatus = document.getElementById("save-status");
const sessionsList = document.getElementById("sessions-list");
const sessionTemplate = document.getElementById("session-template");

// 初始化
// 加载设置
function loadSettings(callback) {
  chrome.storage.local.get(["confirmDelete"], function (result) {
    const confirmDelete =
      result.confirmDelete === undefined ? true : result.confirmDelete;
    document.getElementById("confirm-delete").checked = confirmDelete;
    if (callback) callback();
  });
}

// 保存设置
function saveSettings() {
  const confirmDelete = document.getElementById("confirm-delete").checked;
  chrome.storage.local.set({ confirmDelete });
}

document.addEventListener("DOMContentLoaded", () => {
  // 初始化设置
  loadSettings();

  // 监听设置变更
  document
    .getElementById("confirm-delete")
    .addEventListener("change", saveSettings);

  // 加载保存的会话
  loadSessions();

  // 设置事件监听器
  saveSessionButton.addEventListener("click", saveCurrentSession);
});

// 保存当前会话
function saveCurrentSession() {
  const sessionName = sessionNameInput.value.trim();

  // 显示保存中状态
  saveStatus.textContent = "正在保存...";
  saveStatus.className = "status";

  // 发送消息给后台脚本
  chrome.runtime.sendMessage(
    {
      action: "saveSession",
      sessionName: sessionName,
    },
    function (response) {
      if (response && response.success) {
        // 保存成功
        saveStatus.textContent = "会话已保存！";
        saveStatus.className = "status success";
        sessionNameInput.value = "";

        // 重新加载会话列表
        loadSessions();

        // 3秒后清除状态消息
        setTimeout(() => {
          saveStatus.textContent = "";
          saveStatus.className = "status";
        }, 3000);
      } else {
        // 保存失败
        saveStatus.textContent = `保存失败: ${
          response ? response.error : "未知错误"
        }`;
        saveStatus.className = "status error";
      }
    }
  );
}

// 加载保存的会话
function loadSessions() {
  // 发送消息给后台脚本
  chrome.runtime.sendMessage(
    {
      action: "getAllSessions",
    },
    function (response) {
      if (response && response.success) {
        // 清空会话列表
        sessionsList.innerHTML = "";

        const sessions = response.sessions;
        const sessionIds = Object.keys(sessions);

        if (sessionIds.length === 0) {
          // 没有保存的会话
          const emptyMessage = document.createElement("div");
          emptyMessage.className = "empty-message";
          emptyMessage.textContent = "没有保存的会话";
          sessionsList.appendChild(emptyMessage);
        } else {
          // 按创建时间降序排序会话
          sessionIds.sort((a, b) => {
            return (
              new Date(sessions[b].createdAt) - new Date(sessions[a].createdAt)
            );
          });

          // 添加每个会话到列表
          sessionIds.forEach(sessionId => {
            const session = sessions[sessionId];
            addSessionToList(sessionId, session);
          });
        }
      } else {
        console.error("加载会话失败:", response ? response.error : "未知错误");

        // 显示错误消息
        sessionsList.innerHTML = "";
        const errorMessage = document.createElement("div");
        errorMessage.className = "empty-message error";
        errorMessage.textContent = `加载会话失败: ${
          response ? response.error : "未知错误"
        }`;
        sessionsList.appendChild(errorMessage);
      }
    }
  );
}

// 将会话添加到列表
function addSessionToList(sessionId, session) {
  // 克隆模板
  const sessionElement = document.importNode(
    sessionTemplate.content,
    true
  ).firstElementChild;

  // 填充会话信息
  sessionElement.querySelector(".session-name").textContent = session.name;
  sessionElement.querySelector(".session-date").textContent = new Date(
    session.createdAt
  ).toLocaleString("af");
  sessionElement.querySelector(
    ".session-tabs-count"
  ).textContent = `${session.tabs.length} 个标签页`;

  // 设置恢复按钮事件
  const restoreButton = sessionElement.querySelector(".restore-btn");
  restoreButton.addEventListener("click", () => restoreSession(sessionId));

  // 设置编辑按钮事件
  const editButton = sessionElement.querySelector(".edit-btn");
  editButton.addEventListener("click", () => editSession(sessionId));

  // 设置删除按钮事件
  const deleteButton = sessionElement.querySelector(".delete-btn");
  deleteButton.addEventListener("click", () => deleteSession(sessionId));

  // 添加到列表
  sessionsList.appendChild(sessionElement);
}

// 恢复会话
function restoreSession(sessionId) {
  // 发送消息给后台脚本
  chrome.runtime.sendMessage(
    {
      action: "restoreSession",
      sessionId: sessionId,
    },
    function (response) {
      if (response && response.success) {
        // 恢复成功，关闭弹出窗口
        window.close();
      } else {
        console.error("恢复会话失败:", response ? response.error : "未知错误");
        alert(`恢复会话失败: ${response ? response.error : "未知错误"}`);
      }
    }
  );
}

// 删除会话
function deleteSession(sessionId) {
  // 检查是否需要确认
  const confirmDelete = document.getElementById("confirm-delete").checked;

  if (confirmDelete) {
    // 显示确认对话框
    showConfirmDialog(() => performDelete(sessionId));
  } else {
    // 直接删除
    performDelete(sessionId);
  }
}

function performDelete(sessionId) {
  // 发送消息给后台脚本
  chrome.runtime.sendMessage(
    {
      action: "deleteSession",
      sessionId: sessionId,
    },
    function (response) {
      if (response && response.success) {
        // 重新加载会话列表
        loadSessions();
      } else {
        console.error("删除会话失败:", response ? response.error : "未知错误");
        alert(`删除会话失败: ${response ? response.error : "未知错误"}`);
      }
    }
  );
}

// 编辑会话
let currentEditSessionId = null;
let currentSessionData = null;

function editSession(sessionId) {
  // 保存当前正在编辑的会话ID
  currentEditSessionId = sessionId;

  // 发送消息给后台脚本获取会话数据
  chrome.runtime.sendMessage(
    {
      action: "getAllSessions",
    },
    function (response) {
      if (response && response.success) {
        const sessions = response.sessions;
        const session = sessions[sessionId];

        if (session) {
          // 保存当前会话数据的副本
          currentSessionData = JSON.parse(JSON.stringify(session));

          // 显示编辑对话框并填充数据
          showEditDialog(session);
        } else {
          console.error("找不到会话:", sessionId);
          alert("找不到会话");
        }
      } else {
        console.error(
          "获取会话数据失败:",
          response ? response.error : "未知错误"
        );
        alert(`获取会话数据失败: ${response ? response.error : "未知错误"}`);
      }
    }
  );
}

// 存储原始窗口高度
let originalPopupHeight = null;

// 显示编辑对话框
function showEditDialog(session) {
  const dialog = document.getElementById("edit-dialog");
  const confirmBtn = document.getElementById("edit-confirm");
  const cancelBtn = document.getElementById("edit-cancel");

  // 保存原始高度并设置最小高度
  originalPopupHeight = document.documentElement.style.minHeight;
  document.documentElement.style.minHeight = "450px";

  // 填充表单数据
  populateEditForm(session);

  // 显示对话框
  dialog.classList.remove("hidden");

  // 确认按钮点击事件
  const handleConfirm = () => {
    saveEditedSession();
    hideEditDialog();
  };

  // 取消按钮点击事件
  const handleCancel = () => {
    hideEditDialog();
  };

  // 添加事件监听器
  confirmBtn.addEventListener("click", handleConfirm);
  cancelBtn.addEventListener("click", handleCancel);

  // 点击对话框外部关闭对话框
  dialog.addEventListener("click", event => {
    if (event.target === dialog) {
      hideEditDialog();
    }
  });

  // 清理函数
  function hideEditDialog() {
    dialog.classList.add("hidden");
    confirmBtn.removeEventListener("click", handleConfirm);
    cancelBtn.removeEventListener("click", handleCancel);
    dialog.removeEventListener("click", handleCancel);

    // 恢复原始高度
    document.documentElement.style.minHeight = originalPopupHeight;
    originalPopupHeight = null;

    // 重置当前编辑状态
    currentEditSessionId = null;
    currentSessionData = null;
  }
}

// 填充编辑表单
function populateEditForm(session) {
  const nameInput = document.getElementById("edit-session-name");
  const tabsList = document.getElementById("edit-tabs-list");

  // 设置会话名称
  nameInput.value = session.name;

  // 清空标签页列表
  tabsList.innerHTML = "";

  // 添加每个标签页到列表
  session.tabs.forEach((tab, index) => {
    const tabItem = document.createElement("div");
    tabItem.className = "edit-tab-item";
    tabItem.dataset.index = index;

    // 创建标签页图标
    const favicon = document.createElement("img");
    favicon.className = "edit-tab-favicon";
    favicon.src = tab.favIconUrl || "images/default-favicon.svg";
    favicon.onerror = () => {
      favicon.src = "images/default-favicon.svg";
    };

    // 创建标签页标题
    const title = document.createElement("div");
    title.className = "edit-tab-title";
    title.textContent = tab.title || tab.url;
    title.title = tab.url;

    // 创建删除按钮
    const removeBtn = document.createElement("button");
    removeBtn.className = "edit-tab-remove";
    removeBtn.textContent = "移除";
    removeBtn.addEventListener("click", () => {
      // 从当前会话数据中移除标签页
      currentSessionData.tabs.splice(index, 1);

      // 重新填充表单
      populateEditForm(currentSessionData);
    });

    // 添加元素到标签页项
    tabItem.appendChild(favicon);
    tabItem.appendChild(title);
    tabItem.appendChild(removeBtn);

    // 添加到列表
    tabsList.appendChild(tabItem);
  });
}

// 保存编辑后的会话
function saveEditedSession() {
  if (!currentEditSessionId || !currentSessionData) {
    console.error("没有正在编辑的会话");
    return;
  }

  // 获取编辑后的会话名称
  const nameInput = document.getElementById("edit-session-name");
  const newName = nameInput.value.trim();

  // 更新会话数据
  currentSessionData.name = newName;

  // 发送消息给后台脚本
  chrome.runtime.sendMessage(
    {
      action: "editSession",
      sessionId: currentEditSessionId,
      sessionData: currentSessionData,
    },
    function (response) {
      if (response && response.success) {
        // 重新加载会话列表
        loadSessions();
      } else {
        console.error("保存编辑失败:", response ? response.error : "未知错误");
        alert(`保存编辑失败: ${response ? response.error : "未知错误"}`);
      }
    }
  );
}

// 显示确认对话框
function showConfirmDialog(onConfirm) {
  const dialog = document.getElementById("confirm-dialog");
  const confirmBtn = document.getElementById("dialog-confirm");
  const cancelBtn = document.getElementById("dialog-cancel");

  // 显示对话框
  dialog.classList.remove("hidden");

  // 确认按钮点击事件
  const handleConfirm = () => {
    hideConfirmDialog();
    onConfirm();
  };

  // 取消按钮点击事件
  const handleCancel = () => {
    hideConfirmDialog();
  };

  // 添加事件监听器
  confirmBtn.addEventListener("click", handleConfirm);
  cancelBtn.addEventListener("click", handleCancel);

  // 点击对话框外部关闭对话框
  dialog.addEventListener("click", event => {
    if (event.target === dialog) {
      hideConfirmDialog();
    }
  });

  // 清理函数
  function hideConfirmDialog() {
    dialog.classList.add("hidden");
    confirmBtn.removeEventListener("click", handleConfirm);
    cancelBtn.removeEventListener("click", handleCancel);
    dialog.removeEventListener("click", handleCancel);
  }
}
